<template>
   <div class="page-container">
     <h2>背景图片导入</h2>
     <section class="bg-img"></section>
     <h2>输入框数字失去焦点后自动保留2位小数-指令实现</h2>
     <a-input v-model.trim="number" v-rounding-Number="2" name="number"></a-input>
     <h2>关闭输入框的自动完成功能</h2>
     <a-input v-model.trim="aInputVal" autocomplete="off"></a-input>
     <h2>使用Vue 中filter过滤器方法的调用</h2>
     <div>{{date}}</div>
     <h2></h2>
     <div v-for="(item,index) in arrayFill" :key="index">{{item.name}}</div>
   </div>
</template>

<script>
export default {
  components: {},
  data() {
    return {
      number: "",
      aInputVal: "",
      date: null,
      arrayFill: Array(3).fill({ name: "linda", age: 18, sex: 1 })
    };
  },
  computed: {},
  mounted() {
    this.filterMethod();
  },
  // 方法集合
  methods: {
    filterMethod() {
      this.date = this.$options.filters.formatDate(new Date(), "YYYY-MM-DD");
    }
  }
};
</script>

<style lang='less' scoped>
.bg-img {
  height: 60px;
  background: url("~@/assets/images/logo.png");
}
</style>
